<template>
  <div class="layout-index">
    <div class="layout-course" @click="toPath('CourseList')">
      查看课程
    </div>
    <div class="layout-course-detail" @click="toPath('CourseContentList')">
      查看课程内容
    </div>
    <div class="loginout" @click="loginout()" v-if="this.status > 0">
      <el-button type="danger">退出登录</el-button>
    </div>
  </div>
</template>

<script>

export default {
  name: 'index',
  data() {
    return {
      status: 0
    }
  },
  created() {
   const token = localStorage.getItem('token')
    if(token){
      this.status = 1
    }
  },
  components: {},
  methods: {

    toPath(value){
      this.$router.push({
        path:'/'+value
      })
    },
    loginout(){
      localStorage.removeItem('token')
      this.$message.success("退出登录成功 !!! ")
      this.$router.push({path:'/login'});
    }

  }
}
</script>

<style>

.layout-index{
  width:100%;
  height: 100%;
  position: absolute;
  background-color: #35DCB6;
}

.layout-course{
  width: 200px;
  height:200px;
  background-color: #FA9579;
  float: left;
  margin: 300px 0 0 450px;
  text-align: center;
  font-size: 30px;
  line-height: 200px;
  border-radius: 10px;
}

.layout-course-detail{
  width: 200px;
  height:200px;
  background-color: #FFBC2F;
  float: left;
  margin: 300px 0 0 400px;
  text-align: center;
  font-size: 30px;
  line-height: 200px;
  border-radius: 10px;
}

.loginout{
  margin: 20px;
}

</style>
